<!DOCTYPE html>
<html>
	<head>
	  	<meta charset="UTF-8">
		<script src="../../public/js/tmpl.js"></script>
		<script>
			var content = template('Phead_resource', {
				title: '会员卡'
			});
			document.write(content);
		</script>
	</head>
	<body class="wrap_bg myCard bgs0">
		
		<header>
			<div class="card_banner black_bg">
				<!--<img src="../../public/img/shop/buildbody_img001.jpg" class="card_bg" />-->
				<div class="card_cover">
					<div class="card_inner store_info color-white">
						
					</div>
				</div>
			</div>
			
		</header>
		
		<section>
			<div class="detail_info bgs0">
				<ul class="achievement">
					
				</ul>
				<!--<div class="bgactive am-text-center bottom_btn">
					<a class="am-text-sm" href="./open_card.html">果断开通</a>
				</div>-->
			</div>
		</section>
		
		
		<footer class="footer_nav">
			<ul class="am-avg-sm-4">
				<li class="">
					<a href="../ReservationSite/index.html" class="grey_color am-text-sm">
						<p class="marginb5">
							<img src="../../public/img/icon/field_default@2x.png"></img>
						</p>
						<span>预约场地</span>
					</a>
				</li>
				<li>
					<a href="../PrivateEducation/index.html" class="grey_color am-text-sm ">
						<p class="marginb5">
							<img src="../../public/img/icon/coach_default@2x.png"></img>
						</p>
						<span>预约私教</span>
					</a>
				</li>
				<li>
					<a href="../plan/index.html" class="grey_color am-text-sm ">
						<p class="marginb5">
							<img src="../../public/img/icon/plan_default@2x.png"></img>
						</p>
						<span>奇顽计划</span>
					</a>
				</li>
				<li class="">
					<a href="javascript:void(0);" class="active_color am-text-sm ">
						<p class="marginb5">
							<img src="../../public/img/icon/user_selected@2x.png"></img>
						</p>
						<span>个人中心</span>
					</a>
				</li>
			</ul>
		</footer>
		
		
		
		
		<!--模板-->
		<!--卡片信息-->
		<script id="store_info" type="text/html">
			<img src="../../public/img/icon/card@3x.png" alt="" class="card_innerbg"/>
			<div class="card_innerCount padding10">
				<img src="{{store_info.myheaderImg}}" class="am-circle am-thumbnail header_img" />
				<h1>{{store_info.shop_name}}</h1>
				<p>{{store_info.describe}}</p>
				<!--<div class="card_innerBottom">
					<div>
						<p>SUPERRANK N0.{{store_info.order_num}}</p>
						<p class="am-text-sm">余额:
							{{if store_info.isOpenCard}}
							<span>{{store_info.price}}</span>
							{{else}}
							<span>尚未开通</span>
							{{/if}}
						</p>
					</div>
					{{if !store_info.isOpenCard}}
					<a href="./open_card.html">开通</a>
					{{/if}}
				</div>-->
			</div>
		</script>
		
		<!--成就优惠-->
		<script id="achievement" type="text/html">
			{{each achievementList}}
			
			<li class="am-g padding10 {{if $index!=0}}border-top-grey{{/if}}">
				<a href="{{$value.src}}">
					<div class="am-u-sm-2 padding0 am-text-center">
						<img src="{{$value.badgeSrc}}" class="tag"/>
					</div>
					<div class="am-u-sm-9">
						<p class="color-whites am-text-sm">{{$value.title}}</p>
						<p>{{$value.describe}}</p>
					</div>
					<div class="am-u-sm-1">
						<i class="am-icon-angle-right am-cion-fw color-grey"></i>
					</div>
				</a>
			</li>
			{{/each}}
		</script>
		
		
		<script>
			var content = template('progress_status', {});
			document.write(content);
		</script>
		
		<script>
			var content = template('Pfoot_resource', {});
			document.write(content);
		</script>
		
		<script type="text/javascript">
			(function($,arttmpl){
				var store_info = {
					shop_name:'SUPERMONKEY',
					describe:'Super Life Super Me',
					myheaderImg:'../../public/img/shop/wxheader_img.jpg',
					order_num:'XXX',
					price:'0',
					isOpenCard:false
				}
				
				var achievementList = [
					{
						badgeSrc:'../../public/img/icon/data@2x.png',
						title:'个人资料',
						describe:'完善个人信息获取bmi值制定锻炼计划',
						src:'./personal_info.html'
						
					},
					{
						badgeSrc:'../../public/img/icon/Voucher@2x.png',
						title:'我的优惠券',
						describe:'场地预约享受价格优惠或时间段优惠',
						src:'./Coupon.html'
						
					},
					{
						badgeSrc:'../../public/img/icon/my@2x.png',
						title:'我的预约',
						describe:'预约成功即可进去健身仓锻炼',
						src:'./appointment.html'
						
					},
					{
						badgeSrc:'../../public/img/icon/Record@2x.png',
						title:'训练记录',
						describe:'该月健身时长及天数记录',
						src:'./record.html'
						
					},
					{
						badgeSrc:'../../public/img/icon/gift@2x.png',
						title:'邀请有奖',
						describe:'邀请好友预约健身即可获得优惠券',
						src:'./Inviting_friends.html'
						
					}
					
				]
				
				var drawStireInfo = function(data){
					var d = {
						store_info:data
					}
					
					var content = arttmpl('store_info', d);
					$('.store_info').html(content);
				}
				
				var drawAchievementList = function(data){
					var d={
						achievementList:data
					}
					
					var content = arttmpl('achievement', d);
					$('.achievement').html(content);
				}
				
				
				
				var sucessCallback_StireInfo = function(res){
					drawStireInfo(res);
				}
				
				var sucessCallback_AchievementList = function(res){
					drawAchievementList(res);
				}
				
				var errorcallback = function(statuscode, statusmsg) {
					console.log(statuscode + "  " + statusmsg);
				};
					
				var faildcallback = function(xhr, errtype, errthow) {
					console.log(xhr.readyState + "  " + xhr.status + "  " + xhr.statusText);
				};
	
	
	
				var getStireInfo_data = function(op, sucessCallback, errorcallback, faildcallback){
					request('url', 't', 'd', store_info, sucessCallback, errorcallback, faildcallback);
				}
				
				var getAchievementList_data = function(op, sucessCallback, errorcallback, faildcallback){
					request('url', 't', 'd', achievementList, sucessCallback, errorcallback, faildcallback);
				}
				
				
				var init = function(){
					
					getStireInfo_data('op', sucessCallback_StireInfo, errorcallback, faildcallback);
					getAchievementList_data('op', sucessCallback_AchievementList, errorcallback, faildcallback);
					var $modal = $('#my-modal-loading');
					$modal.hide();
				}
				
				init();
				
			})(jQuery,template)
		</script>
	</body>
</html>
